<template>
	<div>
		<div class="title" @click="es6()">周末旅行</div>
		<ul>
			<li class="item border-bottom" v-for="(item,index) of this.weekendList" :key="item.id">
				<div class="item-img-wapper">
					<img class="item-img" :src="item.imgUrl" alt="">
				</div>
				<div class="item-content-wapper">
					<p class="item-title">{{item.title}}</p>
					<p class="item-desc">{{item.desc}}</p>
				</div>
			</li>
		</ul>
	</div>
</template>
<script>
export default{
	name: "weekend",
	props: {
		weekendList: Array
	},
	data () {
		return {
			
		}
	},
	methods: {
		es6 () {
			console.log(x)
			let x = 3
		}
	}
}
</script>
<style lang="stylus" scoped>
	@import '~styles/mixins.styl'
	.title
		height .8rem
		line-height .8rem
		background #eee
		text-indent .2rem
	.item-img-wapper
		width 100%
		height 0
		padding-bottom 37.33%
		.item-img
			width 100%
	.item-content-wapper
		position relative
		padding .14rem .2rem .2rem .2rem
		.item-title
			line-height .54rem
			font-size .28rem
			ellipsis()
		.item-desc
			line-height .54rem
			font-size .24rem
			color #616161
			ellipsis()
</style>